<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>22-jQuery操作样式方法</title>
    <script src="./js/jquery-1.12.4.js"></script>
    <script>
      $(function(){
        //    1.利用css方法为div 逐个设置属性
        $('div').css("width",'100px')
        $('div').css("height",'100px')
        $('div').css("background-color",'red')
        //    2.通过jQuery链式操作，同时设置多个属性
        $('div').css("width",'100px').css("height",'100px').css("background-color",'skyblue')
        //    3.通过传入一个对象设置多个属性
        $('div').css({
            "width":"50px",
            "height":'100px',
            "background-color":"pink"
        })
        //    4.获取css样式值
        console.log($('div').css("width"))
      })
    </script>
</head>
<body>
    <div></div>
</body>
</html>